<script>
    'use strict';

    var app = angular.module("WDCC");

    app.register.controller('homePageCtrl', ['$scope', 'toastr', '$http', '$rootScope', '$location', '$anchorScroll', function ($scope, toastr, $http, $rootScope, $location, $anchorScroll) {

        $scope.PublicHead = "html/Public/PublicHead.html";
        $scope.PublicLeft = "html/Public/PublicLeft.html";

        $scope.go = function (name) {
            $scope.homePageUrl = "html/homePage/" + name + ".html";
            $anchorScroll();
        }

        $scope.go("homePage")

        $scope.QueryInfo = {
            pageSize: 10, //每页显示条数
            pageNum: 0, //当前页
            endRow: 0, //结束行
            startRow: 0,//开始行
            pages: 0, //总页数
            total: 0  //总记录条数
        };


        $scope.itemData = function () {
            $scope.echartData = [
                {
                    value: 1986,
                    name: '动静态检测', Image1: 'img/index/icon_dynamic.png'
                }, {
                    value: 2148,
                    name: '附加悬挂', Image1: 'img/index/icon_squer.png'
                }, {
                    value: 5659,
                    name: '接触悬挂', Image1: 'img/index/icon_circle.png'
                }, {
                    value: 1476,
                    name: '支柱及基础', Image1: 'img/index/icon_basic.png'
                }, {
                    value: 144,
                    name: '补偿装置及硬锚', Image1: 'img/index/icon_compensate.png'
                }, {
                    value: 3941,
                    name: '标识及防护', Image1: 'img/index/icon_eye.png'
                }, {
                    value: 1583,
                    name: '设备', Image1: 'img/index/icon_equipt.png'
                }, {
                    value: 4356,
                    name: '绝缘', Image1: 'img/index/icon_break.png'
                }, {
                    value: 4335,
                    name: '集合', Image1: 'img/index/icon_aggregate.png'
                }, {
                    value: 7878,
                    name: '支持装置', Image1: 'img/index/icon_support.png'
                }, {
                    value: 878,
                    name: '外部环境', Image1: 'img/index/icon_computer.png'
                }, {
                    value: 8535,
                    name: '定位装置', Image1: 'img/index/icon_position.png'
                }
            ];
            $scope.total=0;
            for(var  i = 0; i<$scope.echartData.length;i++){
                var num= parseFloat($scope.echartData[i].value);
                $scope.total+=num;
            }

            var rich = {
                total: {
                    color: "#fff",
                    fontSize: 18,
                    align: 'center'
                }
            };


            return $scope.itemOption = {
                backgroundColor: '#fff',
                tooltip: {
                    trigger: 'item',
                    formatter: "{a} <br/>{b}: {c} ({d}%)"
                },
                color: ['#8B96FF', '#AFD554', '#B14CFE', '#5DA520', '#4511E0', '#4C93E3', '#4B4C4E', '#76CFFF', '#51E2C3', '#F5A825', '#EF6459', '#FBD131', '#8D98B4'],
                legend: {
                    selectedMode: false,
                    formatter: function (name) {
                        var total = 0;
                        $scope.echartData.forEach(function (value, index, array) {
                            total+= value.value;
                        });
                        return '{total|' + total + '}';
                    },
                    data: [$scope.echartData[0].name],
                    left: 'center',
                    top: 'center',
                    icon: 'none',
                    align: 'center',
                    textStyle: {
                        color: "#fff",
                        fontSize: 16,
                        rich: rich
                    }
                },
                series: [
                    {
                        name: '访问来源',
                        type: 'pie',
                        selectedMode: 'single',
                        radius: [0, '30%'],

                        label: {
                            normal: {
                                position: 'inner'
                            }
                        },
                        labelLine: {
                            normal: {
                                show: false
                            }
                        },

                        data: [
                            {value: 1548, name: '缺陷总数'}
                        ]
                    },
                    {
                        name: '',
                        type: 'pie',
                        radius: ['40%', '55%'],
                        label: {
                            normal: {
                                //formatter: '{a|{a}}{abg|}\n{hr|}\n  {b|{b}：}{c}  {per|{d}%}  ',
                               /* formatter: '{b|{b}：}{c}  {per|{d}%}  ',
                                backgroundColor: '#eee',
                                borderColor: '#aaa',
                                borderWidth: 1,
                                borderRadius: 4,
                                rich: {
                                    a: {
                                        color: '#999',
                                        lineHeight: 22,
                                        align: 'center'
                                    },
                                    hr: {
                                        borderColor: '#aaa',
                                        width: '100%',
                                        borderWidth: 0.5,
                                        height: 0
                                    },
                                    b: {
                                        fontSize: 16,
                                        lineHeight: 33
                                    },
                                    per: {
                                        color: '#eee',
                                        backgroundColor: '#334455',
                                        padding: [2, 4],
                                        borderRadius: 2
                                    }
                                }*/

                            }
                        },
                        data: $scope.echartData
                    }
                ]
            };
        }
        $scope.itemData()

        $scope.axisData = function () {

            var datas = [[96.3, 96.4, 97.5, 95.6, 98.1, 94.8, 89.6, 94.1, 80.1, 52.4, 75.8, 94.7], [56, 82.3, 78.5, 90, 100.5, 111.3, 67.3, 60.5, 57.1, 91.2, 64.5, 53.8]];
            $scope.axisOption = {
                backgroundColor: '#fff',
                title: {
                    text: '',
                    textStyle: {
                        fontWeight: 'normal',
                        fontSize: 12,
                        color: '#F1F1F3'
                    },
                    left: '6%'
                },
                tooltip: {
                    trigger: 'axis',
                    axisPointer: {
                        lineStyle: {
                            color: '#57617B'
                        }
                    }
                },
                legend: {
                    icon: 'rect',
                    itemWidth: 14,
                    itemHeight: 5,
                    itemGap: 13,
                    data: ['一级', '二级'],
                    right: '4%',
                    textStyle: {
                        fontSize: 12,
                    }
                },
                grid: {
                    left: '1%',
                    bottom: '8%',
                    top: '14%',
                    containLabel: true
                },
                xAxis: [{
                    name: "月份",
                    nameLocation: 'end',
                    type: 'category',
                    boundaryGap: false,
                    axisLine: {
                        lineStyle: {
                            color: '#57617B'
                        }
                    },
                    splitLine: {
                        show: true,
                        lineStyle: {
                            type: 'dashed'
                        }
                    },
                    data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
                    axisLabel: {
                        interval: 0,
                        rotate: 50,
                        textStyle: {
                            fontSize: 12
                        }
                    },
                }],
                yAxis: [{
                    name: "数量",
                    type: 'value',
                    interval: 40,
                    max: 120,
                    axisTick: {
                        show: false
                    },
                    axisLine: {
                        lineStyle: {
                            color: '#57617B'
                        }
                    },
                    axisLabel: {
                        textStyle: {
                            fontSize: 12
                        }
                    },
                    splitLine: {
                        lineStyle: {
                            color: '#57617B'
                        }
                    }
                }],
                series: [
                    {
                        name: '一级',
                        type: 'line',
                        smooth: true,
                        lineStyle: {
                            normal: {
                                width: 2
                            }
                        },
                        areaStyle: {
                            normal: {
                                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                    offset: 0,
                                    color: 'rgba(137,146,255,0.3)'
                                }, {
                                    offset: 0.8,
                                    color: 'rgba(137,146,255,0)'
                                }], false),
                                shadowColor: 'rgba(126,211,33, 0.1)',
                                shadowBlur: 10
                            }
                        },
                        symbolSize: 8,
                        itemStyle: {
                            normal: {
                                color: 'rgb(137,146,255)',
                                borderColor: '#fff'
                            },
                        },
                        data: datas[1],
                    }, {
                        name: '二级',
                        type: 'line',
                        smooth: true,
                        lineStyle: {
                            normal: {
                                width: 2
                            }
                        },
                        areaStyle: {
                            normal: {
                                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                    offset: 0,
                                    color: 'rgba(126,211,33,0.3)'
                                }, {
                                    offset: 0.8,
                                    color: 'rgba(126,211,33,0)'
                                }], false),
                                shadowColor: 'rgba(126,211,33, 0.1)',
                                shadowBlur: 10
                            }
                        },
                        symbolSize: 8,
                        itemStyle: {
                            normal: {
                                color: 'rgb(126,211,33)',
                                borderColor: '#fff'
                            },
                        },
                        data: datas[0],
                    }

                ]
            };
        }
        $scope.axisData()
        /*$scope.axisOption = {
         tooltip: {
         trigger: 'axis'
         },
         legend: {
         data: ['邮件营销', '联盟广告']
         },
         grid: {
         left: '3%',
         right: '4%',
         bottom: '3%',
         containLabel: true
         },
         xAxis: {
         type: 'category',
         boundaryGap: false,
         data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
         },
         yAxis: {
         type: 'value'
         },
         series: [
         {
         name: '邮件营销',
         type: 'line',
         stack: '总量',
         data: [120, 132, 101, 134, 90, 230, 210]
         },
         {
         name: '联盟广告',
         type: 'line',
         stack: '总量',
         data: [220, 182, 191, 234, 290, 330, 310]
         }
         ]
         };*/
        $scope.categoryOption = {
            tooltip: {
                trigger: 'axis',

                axisPointer: {
                    type: 'shadow'
                }
            },
            xAxis: {
                type: 'category',
                name: '线路',
                data: ['滨州', '滨州', '滨州', '滨州', '滨州', '滨州', '滨州']
            },
            yAxis: {
                name: '数量',
                type: 'value'
            },
            legend: {
                data: ['一级', '二级']
            },
            series: [{
                data: [120, 200, 150, 80, 70, 110, 130],
                name: '一级',
                markPoint: {
                    data: [{
                        type: 'max',
                        name: '最大值'
                    },
                        {
                            type: 'min',
                            name: '最小值'
                        }
                    ],
                    label: {
                        normal: {
                            fontSize: '12',
                            fontStyle: '100',
                            color: '#fff'
                        }
                    }
                },
                itemStyle: {
                    normal: {
                        color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                            offset: 0,
                            color: "#4D5BFF" // 0% 处的颜色
                        }, {
                            offset: 1,
                            color: "#E148FC" // 100% 处的颜色
                        }], false),
                        barBorderRadius: [50, 50, 0, 0]
                    }
                },
                type: 'bar'
            }, {
                data: [120, 200, 150, 80, 70, 110, 130],
                name: '二级',
                markPoint: {
                    data: [{
                        type: 'max',
                        name: '最大值'
                    },
                        {
                            type: 'min',
                            name: '最小值'
                        }
                    ],
                    label: {
                        normal: {
                            fontSize: '12',
                            fontStyle: '100',
                            color: '#333'
                        }
                    }
                },
                itemStyle: {
                    normal: {
                        color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                            offset: 0,
                            color: "#71CA0F" // 0% 处的颜色
                        }, {
                            offset: 1,
                            color: "#B2EA44" // 100% 处的颜色
                        }], false),
                        barBorderRadius: [50, 50, 0, 0]

                    }
                },
                type: 'bar'
            }]
        };


    }]);

</script>
<div ng-controller="homePageCtrl" ng-include="homePageUrl"></div>
